<template>
  <div class="common-layout">
    <el-container>
      <el-header class="myhead">
        <Header />
      </el-header>
      <el-main class="mymain">
        <Main />
      </el-main>
    </el-container>
  </div>
</template>

<script setup lang="ts">
import Header from "./components/header.vue";
import Main from "./components/main.vue";
</script>

<style scoped lang="scss">
.myhead {
  position: absolute;
  height: 70px;
  z-index: 50;
  width: 100%;
  // background-color: rgba(0, 255, 255, 0.315);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
  // background: linear-gradient(
  //   to bottom,
  //   rgba(13, 108, 153, 0) 20%,
  //   rgba(13, 108, 153, 0.4) 100%
  // );
}

.mymain {
  position: relative;
  height: 100vh;
  padding: 0;
  overflow-y: hidden;
}</style>
